import './index.scss'
import { Card, Button, Form, Input, message  } from 'antd';
import React from 'react';
import type { FormProps } from 'antd';
import { useDispatch } from 'react-redux';
import {fetchLogin} from '@/store/modules/user'
import {useNavigate} from 'react-router-dom'
import { useSelector } from 'react-redux';
import {setTokenFun} from '@/utils/utils'

const Login: React.FC = () => {
  
  console.log('ceshi-----------');
  const {token} = useSelector( (state: any) => state.user)
  const dispatch = useDispatch();
  const navigate = useNavigate()


  type FieldType = {
    username?: string;
    password?: string;
  };

  const onFinish: FormProps<FieldType>['onFinish'] = (values) => {
    console.log('Success:', values);
    dispatch(fetchLogin(values) as any)
    setTokenFun('xxxxxxxxxxxxxxxxx')
    const userInfo = JSON.stringify({
      name: '韩梅梅',
      mobile: '13811111111'
    })
    localStorage.setItem('userInfo', userInfo)
    navigate('/')
    message.success('登录成功')
    
  };
  return <div className="Login">
     <Card className='Login-card' title='真难啊'>
      <Form onFinish={onFinish} validateTrigger='onBlur'>
        <Form.Item<FieldType>
          name="username"
          rules={[{ required: true, message: 'Please input your username!' }]}
        >
          <Input />
        </Form.Item>

        <Form.Item<FieldType>
          name="password"
          rules={[{ required: true, message: 'Please input your password!' }]}
        >
          <Input />
        </Form.Item>

        <Form.Item>
          <Button type="primary" htmlType="submit">
            Submit
          </Button>
        </Form.Item>
      </Form>
    </Card>
  </div>
}
export default Login